import React, { Component } from 'react'
import store from '../../store'

export default class CompB extends Component {
  constructor () {
    super()
    this.state = {
      count: store.getState().counter,
      menuList: store.getState().menu
    }
  }

  unSubscribl = null

  componentDidMount () {
    const unSubscribl = store.subscribe(() => {
      this.setState({
        count: store.getState().counter,
        menuList: store.getState().menu
      })
    })
    this.unSubscribl = unSubscribl
  }

  componentWillUnmount () {
    this.unSubscribl()
  }

  render () {
    return (
      <div>
        <p>ComB</p>
        <p>count---{this.state.count}</p>
        <p>
          {this.state.menuList.map(item => {
            return (
              <li key={item.id}>
                <img src={item.icon} alt='' />
                <span>{item.title}</span>
              </li>
            )
          })}
        </p>
      </div>
    )
  }
}
